src/components/card-course-group.tsx (1)

42-57: Extract duplicated action styling into one variable.

The two CardAction branches repeat the same class computation; extracting it will simplify future style changes.

Proposed patch

 export function CardCourseGroup({
@@
 } & VariantProps<typeof cardCourseGroupVariants>) {
+  const actionClassName = cn("rounded-full p-3.75", secondary ? "bg-[`#51A2FF`]" : "bg-[`#74D4FF`]")
+
   return (
     <Card className={cn(cardCourseGroupVariants({ secondary }))}>
@@
       {hasWhatsapp && (
         <CardAction
           gradient={false}
-          className={cn("rounded-full p-3.75", secondary ? "bg-[`#51A2FF`]" : "bg-[`#74D4FF`]")}
+          className={actionClassName}
           icon={IconWhatsApp}
           iconSize="normal"
         />
       )}
       {hasTelegram && (
         <CardAction
           gradient={false}
-          className={cn("rounded-full p-3.75", secondary ? "bg-[`#51A2FF`]" : "bg-[`#74D4FF`]")}
+          className={actionClassName}
           icon={IconTelegram}
           iconSize="normal"
         />
       )}

🤖 Prompt for AI Agents

Verify each finding against the current code and only fix it if needed.

In `@src/components/card-course-group.tsx` around lines 42 - 57, The two
CardAction render branches duplicate the same className computation; extract the
computed class into a local variable (e.g., actionClass) before the JSX and use
it for both CardAction components so future style changes are in one place.
Compute actionClass using the existing cn call and the secondary prop logic (the
same expression used now for className), then replace className={cn(...)} in
both CardAction usages with className={actionClass}; keep all other props
(gradient, icon, iconSize) unchanged and reference hasWhatsapp and hasTelegram
as before.

src/components/card-path-selection.tsx (1)

12-12: TODO left in component source.

Line 12 still has an inline TODO (add hover effect). If this is post-MVP work, consider opening a follow-up issue and referencing it here.

If useful, I can draft the hover-state implementation and a small issue template for it.

🤖 Prompt for AI Agents

Verify each finding against the current code and only fix it if needed.

In `@src/components/card-path-selection.tsx` at line 12, Remove the inline TODO
comment "//TODO: add hover effect" from the CardPathSelection component and
either implement a minimal hover state now or replace the TODO with a one-line
task reference to a created follow-up issue (e.g., "TODO: see ISSUE-123 for
hover-state work") so the codebase contains no dangling todos; locate the
comment in the CardPathSelection component (card-path-selection.tsx) and update
the file to either implement the hover effect in the component's styles/JSX or
annotate the TODO with the issue ID and a short note about scope (post-MVP).

src/components/ui/card.tsx (1)

61-61: Make iconSize optional in the prop type to match the default.

iconSize has a runtime default of "normal" (line 58) but the type (line 61) requires it, making the API stricter than necessary.

Proposed patch

-}: React.ComponentProps<"div"> & { icon: IconType; iconSize: "small" | "normal" | "large"; gradient?: boolean }) {
+}: React.ComponentProps<"div"> & { icon: IconType; iconSize?: "small" | "normal" | "large"; gradient?: boolean }) {

🤖 Prompt for AI Agents

Verify each finding against the current code and only fix it if needed.

In `@src/components/ui/card.tsx` at line 61, The prop type currently requires
iconSize even though the component assigns a default of "normal"; make iconSize
optional in the component's props type by changing the declaration for iconSize
to iconSize?: "small" | "normal" | "large" so the runtime default (set near line
58) matches the TypeScript type—update the props object/type used in the
function signature in src/components/ui/card.tsx (the iconSize prop)
accordingly.

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

src/components/ui/card.tsx (1)

71-73: ⚠️ Potential issue | 🟡 Minor

Finish the decorative SVG accessibility cleanup.

Line 72 still includes a <title> inside the non-visual gradient helper SVG. Since this SVG is decorative, remove the title and mark it presentational to avoid assistive-tech noise.

Suggested patch

-        <svg width="0" height="0" className="absolute" aria-hidden="true" focusable="false">
-          <title>Icon gradient helper</title>
+        <svg width="0" height="0" className="absolute" aria-hidden="true" role="presentation" focusable="false">
           <linearGradient id={gradientId} x1="0%" y1="100%" x2="0%" y2="0%">

🤖 Prompt for AI Agents

Verify each finding against the current code and only fix it if needed.

In `@src/components/ui/card.tsx` around lines 71 - 73, Remove the non‑visual
<title> element from the decorative SVG and mark the SVG as presentational:
delete the <title> line and add role="presentation" to the <svg> element (the
element that uses gradientId in src/components/ui/card.tsx) while keeping
aria-hidden="true" and focusable="false".